<template>
  <div>
    <div class="team-list">
      <div class="caption">{{ $t('title') }}</div>
      <ul class="list">
        <li v-for="item in list" :key="item.id">

          <van-button
            plain
            type="primary"
            size="small"
            style="position: absolute;right: 15px;"
            @click="showtc(item.uid)"
          >
            {{ $t('seeting') }}
          </van-button>

          <div class="item" style="margin-top: 40px;">
            <div class="left">
              <div class="id">{{ $t('id') }}：{{ item.uid }}</div>
              <div class="mobile">{{ $t('account') }}：{{ item.mobile }}</div>
              <div v-if="CHEKC_PROXY">{{ $t('level') }}：{{ item.level_name }}</div>
              <div >{{ $t('user_remarks') }}：{{ item.user_remarks }}</div>
              <div >{{ $t('is_withdrawal') }}：{{ item.withdrawal_china }}</div>
              <div >{{ $t('is_transfer') }}：{{ item.transfer_china }}</div>
              
            </div>
            <div class="right">
              <div class="val">{{ $t('wallet') }}：{{ Number(item.wallet).toFixed(2) }} USDT</div>
              <div class="val">{{ $t('profit') }}：{{ Number(item.revenue).toFixed(2) }} USDT</div>
              <div>{{ $t('yeji') }}：{{ item.total_recharge }} USDT</div>
              <div class="time">{{ $t('time') }}：{{ item.ctime }}</div>
              <a v-if="CHEKC_PROXY_UPDATE && info && info.is_partner==1" @click="changeUserLevel(item.uid)">{{ $t('up_level') }}</a>
            </div>
          </div>

          <van-dialog v-model="showPwd" title="设置" show-cancel-button @confirm="buyCdkey()">
            <div class="dialog-1">
              <van-cell>
                <span class="label">能否提现：</span>
                <van-field name="radio">
                  <template #input>
                    <van-radio-group v-model="is_withdrawal" direction="horizontal">
                      <van-radio :name="1">是</van-radio>
                      <van-radio :name="0">否</van-radio>
                    </van-radio-group>
                  </template>
                </van-field>
              
              </van-cell>
              <van-cell>
                <span class="label">能否转账：</span>
                <van-field name="radio">
                  <template #input>
                    <van-radio-group v-model="is_transfer" direction="horizontal">
                      <van-radio :name="1">是</van-radio>
                      <van-radio :name="0">否</van-radio>
                    </van-radio-group>
                  </template>
                </van-field>
              
              </van-cell>
              <van-cell>
                <span class="label">备注：</span>
                <input v-model="user_remarks" type="text" placeholder="请输入备注" >
              </van-cell>
            </div>
          </van-dialog>

        </li>
      </ul>
    </div>
  </div>
</template>
<script>
import { mapActions } from 'vuex'
import { CHEKC_PROXY,CHEKC_PROXY_UPDATE } from '@/config/index'
export default {
  i18n: {
    messages: {
      zh: {
        title: '邀请列表',
        id: '用户ID',
        account: '账号',
        level: '级别',
        profit: '量化盈利',
        time: '注册时间',
        yeji: '推广业绩',
        up_level: '提升用户级别',
        user_remarks:'备注',
        is_withdrawal:'能否提现',
        is_transfer:'能否转账',
        wallet:'余额',
        seeting:'设置',

      },
      en: {
        title: 'Invitation list',
        id: 'User ID',
        account: 'Account',
        level: 'Level',
        profit: 'Profit',
        time: 'Time',
        yeji: 'Performance',
        up_level: 'Up Level',
        user_remarks:'remarks',
        is_withdrawal:'is_withdrawal',
        is_transfer:'is_transfer',
        wallet:'wallet',
        seeting:'seeting',
      }
    }
  },
  props: {
    info: {
      type: Object,
      required: true
    }
  },
  data () {
    return {
      CHEKC_PROXY_UPDATE,
      CHEKC_PROXY,
      list: '',
      showPwd: false,
      user_remarks: '',
      is_withdrawal:0,
      uid:'',
      is_transfer:0
    }
  },
  beforeMount () {
    this.loadData()
  },
  methods: {
    ...mapActions({
      invitationList: 'user/invitationList',
      changeLevel: 'user/changeLevel',
      userSeet: 'user/userSeet'
    }),
    loadData () {
      this.invitationList()
        .then((data) => {
          this.list = data.data.list
        })
    },
    changeUserLevel(uid) {
      this.$dialog.confirm({
        title: '是否要提升该用户等级？'
      })
        .then(() => {
          this.changeLevel({ uid }).then((res) => {
            this.$toast.success(res.msg)
            this.loadData()
          }).catch((res) => {
            this.$toast.fail(res.msg)
          })
        })
    },
    showtc(uid){
      this.showPwd = true
      const robot = (this.robot = this.list.find(
        item => uid === item.uid
      ))
   
      this.is_withdrawal = robot.is_withdrawal
      this.user_remarks = robot.user_remarks
      this.is_transfer = robot.is_transfer
      this.uid = robot.uid

    },
    buyCdkey () {
      this.showPwd = false
      this.$toast.loading()
      const uid = this.uid
      const is_withdrawal = this.is_withdrawal
      const user_remarks = this.user_remarks
      const is_transfer = this.is_transfer
      this.userSeet({ uid,user_remarks,is_withdrawal,is_transfer })
        .then((res) => {
          this.$toast(res.msg)
          this.onRefresh()
        })
        .catch(({ msg }) => {
          this.$toast(msg)
        })
    },
    onInput(is_withdrawal) {
        this.is_withdrawal = is_withdrawal;
    },
    onRefresh () {
      this.loading = true
      this.loadData()
    },
  }
}
</script>
<style scoped lang="less">
.team-list {background-color: #fff;}
.team-list .caption {
  font-size: 16px;
  font-weight: 500;
  padding: 10px 15px;
  border-bottom: 1px solid #eee;
}
.team-list .list {
  overflow: hidden;
  padding: 0 15px;
}
.team-list li {
  padding: 10px 0;
  border-top: 1px solid #eee;
}
.team-list .item {
  display: flex;
  justify-content: space-between;
  line-height: 1.8;
  font-size: 12px;
  a {
    color: @themeColor;
  }
}
.team-list li:first-child {
  border-top: none;
}
.team-list .right {
  text-align: right;
}
.team-list .mobile {
  opacity: 0.8;
}
.dialog-1 {
  padding: 20px 10px;
  .van-cell__value {
    display: flex;align-items: center;
  }
  .label {
    width: 5em;
    flex-shrink: 0;
  }
  input {
    border: none;
    flex-grow: 1;
    min-width: 0;
  }
  .tip {
    text-align: right;
    padding: 10px 16px;
    font-size: 12px;
    span {
      color: blue;
    }
  }
}
</style>
